<template>
	<view class="accountInformationContent">
		<commonNavBar title="主体信息"   ></commonNavBar>    
		<view class="centre">
			<view class="dt">监管信息</view>
			<view class="dd">
				<view class="left">监管环节</view>
				<view class="right">{{ subjectInformationData.superviseLink }}</view>
			</view>
			<view class="dd">
				<view class="left">监管单位</view>
				<view class="right">{{ subjectInformationData.deptName }}</view>
			</view>
			<view class="dd">
				<view class="left">监管责任人</view>
				<view class="right">
					{{ subjectInformationData.gridHeadName }}
				</view>
			</view>
			<view class="dt">企业信息</view>
			<view class="dd">
				<view class="left">招牌(门头)名称</view>
				<view class="right"> 
					<input v-model="subjectInformationData.doorHeadName ==  'undefined' ? '' : subjectInformationData.doorHeadName"  class="edit-form-input"  placeholder="请输入招牌(门头)名称"/>
					<view @tap="updateInfo('doorHeadName')"   v-if="!detail">
						修改
						<view class="triangle"></view>
					</view>
				</view>
			</view>
			<!--<view class="dd">
				<view class="left">招牌名称</view>
				<view class="right">
					<input v-model="subjectInformationData.signName"  class="edit-form-input"   placeholder="请输入招牌名称"/>
					<view @tap="updateInfo('signName')"  v-if="!detail" >
						修改
						<view class="triangle"></view>
					</view> 
				</view>
			</view>-->
			<view class="dd">
				<view class="left">主体名称</view>
				<view class="right">{{ subjectInformationData.companyName }}</view>
			</view>
			<view class="dd">
				<view class="left">统一社会信用代码</view>
				<view class="right">{{ subjectInformationData.creditCode }}</view>
			</view>
			<view class="dd">
				<view class="left">负责人</view>
				<view class="right">{{ subjectInformationData.contact }}</view>
			</view> 
			<view class="dd">
				<view class="left">经营地址</view>
				<view class="right">{{ subjectInformationData.address }}</view>
			</view>
			<view class="dd">
				<view class="left">许可证编号</view>
				<view class="right">{{ subjectInformationData.license }}</view>
			</view>
			<view class="dd">
				<view class="left">有效期自</view>
				<view class="right">{{ subjectInformationData.fzrq }}</view>
			</view>
			<view class="dd">
				<view class="left">有效期至</view>
				<view class="right">{{ subjectInformationData.yxqz }}</view>
			</view>
			<view class="dd">
				<view class="left">发证机关</view>
				<view class="right">{{ subjectInformationData.fzjg }}</view>
			</view>
			<view class="dd">
				<view class="left">发证日期</view>
				<view class="right">{{ subjectInformationData.fzrq }}</view>
			</view>
			<view class="dd">
				<view class="left">许可证状态</view>
				<view class="right">{{ subjectInformationData.licenseStat }}</view>
			</view> 
			<view class="dd">
				<view class="left">联系人</view>
				<view class="right">{{ subjectInformationData.contact }}</view>
			</view>
			<view class="dd">
				<view class="left">联系电话</view>
				<view class="right">{{ subjectInformationData.contactPhone  == 'undefined' ? '': subjectInformationData.contactPhone }}</view>
			</view>
			<view class="dd">
				<view class="left">经营类别</view>
				<view class="right">{{ subjectInformationData.businessCategory }}</view>
			</view>
			<view class="dd">
				<view class="left">经营范围</view>
				<view class="right">{{ subjectInformationData.businessScope }}</view>
			</view>
		
			<template  v-if="subjectInformationData.supProcess == 'cyfw' || subjectInformationData.supProcess == 'spxs' ">
				<view class="dd">
					<view class="left">是否位于校园及其周边</view>
					<view class="right button">
						<text>{{ subjectInformationData.isXiaoyuan === "0" ? '否' : subjectInformationData.isXiaoyuan === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(1)"  v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd">
					<view class="left">是否异常</view>
					<view class="right button">
						<text>{{ subjectInformationData.isYichang === "0" ? '否' : subjectInformationData.isYichang === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(6)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd">
					<view class="left">是否实施“明厨亮灶”工程</view>
					<view class="right button">
						<text v-if="subjectInformationData.mingchuLx == '1'"> 视频厨房</text>
						<text v-else-if="subjectInformationData.mingchuLx == '2'"> 网络直播</text>
						<text v-else-if="subjectInformationData.mingchuLx == '3'"> 透明明档</text>
						<text v-else-if="subjectInformationData.mingchuLx == '4'"> 阳光厨房</text>
						<text v-else-if="subjectInformationData.mingchuLx == '5'"> 其他</text>
						<text v-else> 未设置</text>
						<view @tap="modify(7)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd">
					<view class="left">是否实施“明厨亮灶”工程</view>
					<view class="right button">
						<text>{{ subjectInformationData.isMingchu === "0" ? '否' : subjectInformationData.isMingchu === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(2)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd" >
					<view class="left">仅售预包装食品：</view>
					<view class="right button">
						<text>{{ subjectInformationData.isYbz === "0" ? '否' : subjectInformationData.isYbz === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(3)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd" >
					<view class="left">含特殊食品销售：</view>
					<view class="right button">
						<text>{{ subjectInformationData.isTeshi === "0" ? '否' : subjectInformationData.isTeshi === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(4)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd" v-if="subjectInformationData.isTeshi === '1'" >
					<view class="left">特殊食品分类：</view>
					<view class="right button">
						<text>  {{teshiStr == '' ? "未设置":teshiStr}} </text>
						<view @tap="modify(8)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view>
				<view class="dd">
					<view class="left">是否农产品批发市场</view>
					<view class="right button">
						<text>{{ subjectInformationData.isGongpi === "0" ? '否' : subjectInformationData.isGongpi === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(5)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view> 
				<view class="dd">
					<view class="left">是否设座小餐饮</view>
					<view class="right button">
						<text>{{ subjectInformationData.isShezuo === "0" ? '否' : subjectInformationData.isShezuo === "1" ? '是' : '未设置' }}</text>
						<view @tap="modify(9)" v-if="!detail">
							修改
							<view class="triangle"></view>
						</view>
					</view>
				</view> 
			</template>
			<view class="dd" v-if="subjectInformationData.supProcess == 'spsc' || subjectInformationData.supProcess == 'tssc' ">
				<view class="left">从业人员</view>
				<view class="right button"> 
					<input  class="form-input" placeholder="请填写从业人员数" :disabled="detail" v-model="subjectInformationData.personTotal" />
					<view  > 人 </view>
				</view>
			</view>
			<view class="dd" v-if="subjectInformationData.supProcess == 'spsc' || subjectInformationData.supProcess == 'tssc' ">
				<view class="left">年度营业收入</view>
				<view class="right button"> 
					<input  class="form-input" placeholder="请填写年度营业收入" :disabled="detail" v-model="subjectInformationData.annualIncome" />
					<view  > 万元 </view>
				</view>
			</view>
			<view class="dd" v-if="subjectInformationData.supProcess == 'spsc' || subjectInformationData.supProcess == 'tssc' ">
				<view class="left">抽检分数</view>
				<view class="right button"> 
					<input  class="form-input" placeholder="请填写抽检分数" :disabled="detail" v-model="subjectInformationData.samplingScore" />
					<view  > 分 </view>
				</view>
			</view>  
			<view class="dd" v-if="subjectInformationData.supProcess == 'spsc' || subjectInformationData.supProcess == 'tssc' ">
				<view class="left">约谈分数</view>
				<view class="right button">
					<input  class="form-input" placeholder="请填写约谈分数" :disabled="detail" v-model="subjectInformationData.appointmentScore" />
					<view  > 分 </view>
				</view>
			</view>
		</view>
	 	<view class="fixed"  >
			<view class="button" @tap="dimension"  v-if="subjectInformationData.lngLat == null || subjectInformationData.lngLat == '' || subjectInformationData.lngLat == ''">主体标注</view>
			<view class="button" @tap="lookDimension(subjectInformationData.lngLat)"  v-else >查看定位</view>
			<!-- <view class="button" @tap="finalConfirm()"  >确认</view> -->
		</view>
		<uni-popup ref="modifyPopup" type="bottom">
				<view class="modifyPopupContent">
					<view class="title">主体信息修改</view>
					<view class="box">
						<view class="dd">
							<view class="left">
								<text v-if="modifyTitle === 1 ">位于校园及其周边</text>
								<text v-else-if="modifyTitle === 2 ">实施“明厨亮灶”工程'</text> 
								<text v-else-if="modifyTitle === 3 ">仅售预包装食品</text> 
								<text v-else-if="modifyTitle === 4 ">含特殊食品销售</text> 
								<text v-else-if="modifyTitle === 5 ">是否农产品批发市场</text> 
								<text v-else-if="modifyTitle === 6  ">异常主体</text>
								<text v-else-if="modifyTitle === 9  ">是否设座小餐饮</text> 
								</text>
							</view>
							<view class="right">
							<!-- 	<uni-data-select :localdata="userList" @change="lawEnforcementOfficialsOne"
									:clear="false"></uni-data-select> -->
								<picker style="width: 500rpx;height: 40px;" :range="towList" range-key="text" :value="pickerValue" @change="selectValue"><text style="line-height: 40px;">{{towList[pickerValue].text}}</text></picker>
							</view>
						</view>
						<view class="dd">
							<view class="left">修改原因</view>
							<view class="right">
								<input type="text" placeholder="请输入" style="font-size: 16px;" v-model="reasonForModification"
									placeholder-class="placeholder-class" />
							</view>
						</view>
					</view>
					<view class="button">
						<button class="determine" @click="finalConfirm()">确认</button>
						<button class="cancellation" @click="closeResultLog()">取消</button>
					</view>
				</view>
			</uni-popup>
		<uni-popup ref="modifyPopup2" type="bottom">
			<view class="modifyPopupContent">
				<view class="title">主体信息修改</view>
				<view class="box">
					<view class="dd">
						<view class="left">
							<text v-if="modifyTitle === 1 ">位于校园及其周边</text>
							<text v-else-if="modifyTitle === 2 ">实施“明厨亮灶”工程'</text> 
							<text v-else-if="modifyTitle === 3 ">仅售预包装食品</text> 
							<text v-else-if="modifyTitle === 4 ">含特殊食品销售</text> 
							<text v-else-if="modifyTitle === 5 ">是否农产品批发市场</text> 
							<text v-else-if="modifyTitle === 6  ">E级主体</text>
							<text v-else-if="modifyTitle === 7  ">明厨亮灶类型</text>  
						</view>
						<view class="right">
						<!-- 	<uni-data-select :localdata="userList" @change="lawEnforcementOfficialsOne"
								:clear="false"></uni-data-select> -->
							<picker style="width: 500rpx;height: 40px;" :range="cameraList" range-key="text" :value="pickerValue2" @change="selectValue2"><text style="line-height: 40px;">{{cameraList[pickerValue2].text}}</text></picker>
						</view>
					</view>
					<view class="dd">
						<view class="left">修改原因</view>
						<view class="right">
							<input type="text" placeholder="请输入" style="font-size: 16px;" v-model="reasonForModification"
								placeholder-class="placeholder-class" />
						</view>
					</view>
				</view>
				<view class="button">
					<button class="determine" @click="finalConfirm()">确认</button>
					<button class="cancellation" @click="closeResultLog()">取消</button>
				</view>
			</view>
		</uni-popup>
		<uni-popup ref="modifyPopup3" type="bottom">
			<view class="modifyPopupContent">
				<view class="title">主体信息修改</view>
				<view class="box">
					<view class="dd">
						<view class="left">
							<text>特殊食品分类</text>
						</view>
						<view class="right">
							<zxz-uni-data-select v-model="pickerValue3" :multiple="true" dataKey="text" dataValue="value" :collapseTagsNum="4" :collapseTags="true"
								:localdata="foodTypeList"  placeholder="请选择特殊食品分类"  :clear="false"
							></zxz-uni-data-select>
						<!-- 	<uni-data-select :localdata="userList" @change="lawEnforcementOfficialsOne"
								:clear="false"></uni-data-select> -->
							<!-- <picker style="width: 500rpx;height: 40px;"  mode="selector"  :range="foodTypeList" range-key="text" :value="pickerValue3" @change="selectValue3"><text style="line-height: 40px;">{{foodTypeList[pickerValue3].text}}</text></picker> -->
						</view>
					</view>
					<view class="dd">
						<view class="left">修改原因</view>
						<view class="right">
							<input type="text" placeholder="请输入" style="font-size: 16px;" v-model="reasonForModification"
								placeholder-class="placeholder-class" />
						</view>
					</view>
				</view>
				<view class="button">
					<button class="determine" @click="finalConfirm()">确认</button>
					<button class="cancellation" @click="closeResultLog()">取消</button>
				</view>
			</view>
		</uni-popup>
		
	</view>
</template>

<script>
	import commonNavBar from '@/components/CommonNavBar.vue';
	
	export default {
		components:{
			commonNavBar
		},
		data() {
			return {
				title: '档案信息',
				subjectInformationData: {},
				pickerValue:0,
				pickerValue2:0,
				pickerValue3:0,
				companyId:null,
				detail:false,
				towList: [{
					value: 0,
					text: '否'
				}, {
					value: 1,
					text: '是'
				}],
			
				cameraList:[
					{
						value: 1,
						text: '视频厨房'
					},
					{
						value: 2,
						text: '网络直播'
					},
					{
						value: 3,
						text: '透明明档'
					},
					{
						value: 4,
						text: '阳光厨房'
					},
					{
						value: 5,
						text: '其他'
					}
				], 
				foodTypeList:[
					{
						value: 1,
						text: '保健食品'
					},
					{
						value: 2,
						text: '婴幼儿配方乳粉'
					},
					{
						value: 3,
						text: '特殊医学用途配方食品'
					},
					{
						value: 4,
						text: '其他婴幼儿配方食品'
					} 
				], 
				modifyTitle: null,
				reasonForModification: ''
			}
		},
		computed:{
			teshiStr:function(){  
				let  teshiString = "";
				let teshiArr = this.subjectInformationData.teshiLeixing == null ? [] : this.subjectInformationData.teshiLeixing.split(",");
				for (var i = 0; i < teshiArr.length; i++) {
					if(teshiArr[i] == '1'){
						teshiString = teshiString + "保健食品;\n\t"
					}
					if(teshiArr[i] == '2'){
						teshiString = teshiString + "婴幼儿配方乳粉;\n\t"
					}
					if(teshiArr[i] == '3'){
						teshiString = teshiString + "特殊医学用途配方食品;\n\t"
					}
					if(teshiArr[i] == '4'){
						teshiString = teshiString + "其他婴幼儿配方食品;\n\t"
					}
				}
				
				return teshiString;
			}
		}, 
		onLoad(options) {
			this.companyId = options.subjectInformationId;
			this.detail = options.detail == '1' ? false :true;
			this.initData(options.subjectInformationId);
		},
		methods: {
			goBack() {
				uni.navigateBack();
			},
			async initData(id) {
				uni.showLoading({
					title:'获取数据中',
					mask: true
				})
				let data = {
					id: id
				}
				try {
					const res = await uni.$api.getCompanyDetail(data);
					this.subjectInformationData = res.data.data 
				} catch (error) {
					console.error(error)
				}
				uni.hideLoading();
			},
			modify(key) { 
				this.pickerValue = 0
				this.reasonForModification = ''
				this.modifyTitle = key
				if(key  == '7'){
					this.$refs.modifyPopup2.open('bottom')
				} else if(key  == '8'){
					this.$refs.modifyPopup3.open('bottom')
				} else {
					this.$refs.modifyPopup.open('bottom')
				}
			},
			updateInfo(type){
				//修改信息
				const  that = this;
				if(that.subjectInformationData[type] == ''){
					uni.showToast({
						 icon:'error',
						title:'请输入内容'
					})
					return;
				}
				uni.showModal({
					title:'提示',
					content: '确认提交保存?',
					success: async function (res) {
						if (res.confirm) {
							uni.showLoading({
								title:'保存中...',
								mask: true
							})
							 const res = await uni.$api.saveCompanyInfo({
								companyId: that.subjectInformationData.id,
								fieldName: type,
								fieldValue: that.subjectInformationData[type]
							 });
							 uni.hideLoading();
							 console.log("保存结果",res.data );
							 if(res.data.code == '0'){
								 uni.showToast({
									title:'保存成功!'
								 })
								 return;
							 }
							 uni.showToast({
								 icon:'none',
							 	title: res.data.msg
							 }) 
						}  
					}
,				})
			},
			closeResultLog() {
				if(this.$refs.modifyPopup){
					this.$refs.modifyPopup.close('bottom')
				}
				
				if(this.$refs.modifyPopup2){
					this.$refs.modifyPopup2.close('bottom')
				}
				
				if(this.$refs.modifyPopup3){
					this.$refs.modifyPopup3.close('bottom')
				}
				
			},
			async finalConfirm(){
				//保存属性
				try {
					let  data = {
						id: this.companyId,
						reason: this.reasonForModification,
						personTotal:this.subjectInformationData.personTotal == '' ? 0 : this.subjectInformationData.personTotal,
						annualIncome:this.subjectInformationData.annualIncome == '' ? 0 : this.subjectInformationData.annualIncome,
						samplingScore:this.subjectInformationData.samplingScore == '' ? 0 : this.subjectInformationData.samplingScore,
						appointmentScore:this.subjectInformationData.appointmentScore == '' ? 0 : this.subjectInformationData.appointmentScore
					}
					if(this.modifyTitle == 1) {
						data.isXiaoyuan = this.towList[this.pickerValue].value;
					} else if(this.modifyTitle == 2) {
						data.isMingchu = this.towList[this.pickerValue].value;
					} else if(this.modifyTitle == 3) {
						data.isYbz = this.towList[this.pickerValue].value;
					} else if(this.modifyTitle == 4) {
						data.isTeshi = this.towList[this.pickerValue].value;
					} else if(this.modifyTitle == 5) {
						data.isGongpi = this.towList[this.pickerValue].value;
					}  else if(this.modifyTitle == 6) {
						data.isYichang = this.towList[this.pickerValue].value;
					}  else if(this.modifyTitle == 7) {
						data.mingchuLx = this.cameraList[this.pickerValue2].value;
					}  else if(this.modifyTitle == 8) {
						data.teshiLeixing = this.pickerValue3;
					} else if(this.modifyTitle == 9) {
						data.isShezuo = this.towList[this.pickerValue].value
					} 
					const res = await uni.$api.updateCompanyPortrait(data); 
					 if(res.data.code == '1'){
						 uni.showToast({
						 	icon:'error',
							title:'修改失败'
						 })
						 return;
					 } else {
						 uni.showToast({
						 	icon:'success',
							title:'修改完成'
						 })
						 if(this.$refs.modifyPopup){
							 this.$refs.modifyPopup.close('bottom')
						 }
						 if(this.$refs.modifyPopup2){
							 this.$refs.modifyPopup2.close('bottom')
						 } 
						 
						 if(this.$refs.modifyPopup3){
							 this.$refs.modifyPopup3.close('bottom')
						 } 
						 
						 this.initData(this.companyId);
						 return;
					 }
					
				} catch (error) {
					console.error(error)
				}
			},
			selectValue(e) { 
				this.pickerValue = e.detail.value
			},
			selectValue2(e) { 
				this.pickerValue2 = e.detail.value
			},
			selectValue3(e) { 
				this.pickerValue3 = e.detail.value
			},
			dimension(){
				//主体标注
				uni.navigateTo({
					url:'/pages/dimension/dimension?companyId='+this.companyId
				})
			},
			lookDimension(lng_lat){
				//查看标注位置,并可重新标注
				const that = this;
				 uni.navigateTo({
				 	url:'/pages/dimension/dimension?companyId='+this.companyId+"&lng_lat="+lng_lat
				 })
			/* 	uni.navigateTo({
					url:'/pages/dimension/showPoint?companyId='+this.companyId+'&lng_lat='+lng_lat 
				}) */
			}
		}
	}
</script>

<style lang="scss">
	.accountInformationContent {
		background: #F9F9F9;
		// height: calc(100vh - 195rpx);

		.upper {
			position: fixed;
			z-index: 1;
			top: 0;
			left: 0;
			width: 100%;

			.title {
				background: url('../../static/img/inspectBg.png');
				background-size: cover;
				width: 100%;
				height: 115rpx;
				line-height: 115rpx;
				position: relative;
				display: flex;
				justify-content: center;

				.arrow {
					position: absolute;
					left: 33rpx;
					top: 50%;
					transform: translate(0%, -50%);
					width: 100rpx;
					height: 100rpx;

					&::before {
						display: block;
						content: "";
						position: absolute;
						top: 50%;
						left: 0%;
						width: 20rpx;
						height: 20rpx;
						border-left: 1px solid #fff;
						border-top: 1px solid #fff;
						transform: translate(0%, -50%) rotate(-45deg);
					}
				}

				text {
					font-size: 30rpx;
					font-family: PingFangSC-Medium, PingFang SC;
					font-weight: 500;
					color: #FFFFFF;
					letter-spacing: 1px;
				}
			}
		}

		.centre {
			padding: 0 17.5rpx;
			height: calc(100vh - 280rpx);
			overflow-x: hidden;

			.dt {
				display: flex;
				justify-content: center;
				align-items: center;
				font-size: 24rpx;
				background: #F9F9F9;
				font-weight: bold;
				border-bottom: 2rpx solid #D6D6D6;
				padding: 30rpx 0;
			}

			.dd {
				display: flex;
				justify-content: flex-start;
				font-size: 24rpx;
				border: 2rpx solid #D6D6D6;
				border-top: none;
				background: #fff;

				.left {
					width: 150rpx;
					background: #F9F9F9;
					border-right: 2rpx solid #D6D6D6;
					padding: 20rpx 10rpx 20rpx 20rpx;
				}

				.right {
					width: 600rpx;
					padding: 0 0 0 20rpx;
					display: flex;
					align-items: center;


					view {
						background: none;
						border: none;
						font-size: 24rpx;
						position: relative;
						color: #0902FF;

						.triangle {
							width: 0;
							height: 0;
							border-top: 8rpx solid transparent;
							border-bottom: 8rpx solid transparent;
							border-left: 10rpx solid #0902FF;
							position: absolute;
							top: 50%;
							right: -20rpx;
							transform: translate(0%, -50%);
						}
					}

					&.button {
						justify-content: space-around;
					}
				}
			}
		}

		.fixed {
			position: fixed;
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			
			.button {
				margin: 40rpx auto 0;
				width: 269rpx;
				height: 55rpx;
				line-height: 55rpx;
				background: #0552A9;
				border-radius: 10rpx;
				font-size: 20rpx;
				font-family: PingFangSC-Regular, PingFang SC;
				font-weight: 400;
				text-align: center;
				color: #fff;
			}
		}
	
		.modifyPopupContent {
			background: #FFFFFF;
			border-radius: 20rpx 20rpx 0 0;

			.title {
				width: 100%;
				height: 80rpx;
				line-height: 80rpx;
				background: url('../../static/img/popupTitle.png') no-repeat center center;
				background-size: cover;
				font-size: 25rpx;
				font-family: PingFangSC-Medium, PingFang SC;
				font-weight: 500;
				color: #FFFFFF;
				// text-indent: 45rpx;
				text-align: center;
			}

			.box {
				text-align: center;
				margin: 50rpx auto;

				.dd {
					display: flex;
					justify-content: flex-start;
					font-size: 24rpx;
					border: 2rpx solid #D6D6D6;
					background: #fff;

					.left {
						width: 150rpx;
						background: #F9F9F9;
						border-right: 2rpx solid #D6D6D6;
						padding: 20rpx 10rpx 20rpx 20rpx;
					}

					.right {
						width: 600rpx;
						padding: 0 0 0 20rpx;
						display: flex;
						align-items: center;


						view {
							background: none;
							border: none;
							font-size: 24rpx;
							position: relative;
							color: #0902FF;
						}
					}
					
					&+.dd {
						border-top: none;
					}
				}
			}

			.button {
				margin: 58rpx auto 0;
				padding: 0 95rpx 24rpx 95rpx;
				display: flex;

				button {
					width: 269rpx;
					height: 55rpx;
					line-height: 55rpx;
					background: #0552A9;
					border-radius: 10rpx;
					font-size: 20rpx;
					font-family: PingFangSC-Regular, PingFang SC;
					font-weight: 400;

					&.determine {
						color: #fff;
					}

					&.cancellation {
						background: none;
						border: 1rpx solid #979797;
						color: #979797;
					}
				}
			}
		}
	}
	.form-input{
		border: 0px;
		border-bottom: 1px solid #F9F9F9;
		color:#000;
		font-size: 24rpx;
	}
	.edit-form-input{
		border: 0px;
		border-bottom: 1px solid #F9F9F9;
		color:#000;
		font-size: 24rpx;
		width: 400rpx;
	}
</style>